<template>
	<view>
		<u-modal title='温馨提示' v-model="show" :show-confirm-button='false' :mask-close-able='false'>
			<view class="auth-box">
				<view class="auth-title">
					点击下方授权手机号，以便给您提供更多服务
				</view>
				<u-button @getphonenumber='handPhone' open-type='getPhoneNumber' type='jz' :ripple="true">绑定手机号</u-button>
				<view class="look-title" @click="handNavLook">
					再看看
				</view>
			</view>
		</u-modal>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: true,
				userCode: ''
			};
		},
		onLoad(e) {
			console.log(e, '传递code')
			this.userCode = e.userCode
		},
		methods: {
			//获取用户手机号
			async handPhone(e) {
				const encryptedData = e.detail.encryptedData;
				const ivStr = e.detail.iv;
				let _this = this
				_this.cache.setCache('userCode', this.userCode)
				if (!encryptedData || !ivStr) {
					_this.cache.removeCache('userCode')
					_this.cache.removeCache('phone')
					uni.showToast({
						title: '请授权手机号以获得完整服务~',
						icon: 'none',
					})
					return
				};
				let res = await this.$u.api.getPhone({
					encryptedData: encryptedData,
					iv: ivStr
				}); //设置手机号
				if (res.phoneNumber) {
					this.cache.setCache('phone', res.phoneNumber)
					let isMsg = await this.$u.api.verifyUserInfo()
					uni.navigateBack({
						delta: 3
					})
				}
			},
			handNavLook() {
				uni.navigateBack({
					delta: 3
				})
			}
		}
	}
</script>

<style lang="scss">
	.auth-box {
		padding: 60upx;

		.auth-title {
			margin-bottom: 60upx;
		}

		.look-title {
			font-size: $bs-font-size-24;
			color: $bs-text-color-999;
			text-align: center;
			width: 100%;
			margin-top: 20rpx;
			// color: $bs;
		}
	}
</style>
